<template>
	<view>
		<view class="main">
			<ul>
				<li v-for="(v,i) in data" :key="v.id" class="p30">
					<view>
						<p v-if="v.type == 0" class="p1 text-lg"> 支出 </p>
						<p v-if="v.type == 1" class="p1 text-lg"> 收入 </p>
						<p class="p2"> {{v.createTime}}</p>
					</view>
					<view  v-if="v.type == 0" class=" text-lg">- ￥{{v.amount}}</view>
					<view  v-if="v.type == 1" class=" text-lg"> + ￥{{v.amount}}</view>
				</li>
			</ul>
		</view>
	</view>
</template>

<script>
	import {
		tradeRecord
	} from '@/api/api.js';
	export default {
		data() {
			return {
				data: [],
				stops: 0,
				datas: {
					cardId: 0,
					page: 0,
					size: 20
				}
			};
		},
		onLoad(e) {
			this.datas.cardId = e.id
			this.init();
		},
		onReachBottom() {
			if (this.stops == 0) {
				this.addList()
			}
		},
		methods: {
			async init() {
				this.datas.page = 0
				let data = await tradeRecord(this.datas);
				data = data.datas
				if (data.length != this.datas.size) {
					this.stops = 1
				}
				this.data = data
			},
			async addList() {
				this.datas.page = this.datas.page + 1
				let data = await tradeRecord(this.datas);
				data = data.datas
				if (data.length != this.datas.size) {
					this.stops = 1
				}
				this.data = [...this.data, data]
			}
		},
		computed: {}
	};
</script>

<style lang="less" scoped>
	@import './index.less';
</style>
